<!--
 * @Description: 人脸识别监控
 * @Autor: dyx
 * @Date: 2023-02-24 17:43:00
 * @LastEditTime: 2023-02-25 09:23:12
-->
<template>
  <div>
    <el-dialog
      title="人脸识别监控"
      :close-on-click-modal="false"
      :visible.sync="visible"
      class="JADP-dialog JADP-dialog_center"
      lock-scroll
      width="50%"
      append-to-body
    >
      <JADP-table v-loading="listLoading" :data="list">
        <el-table-column
          prop="verifytime"
          label="验证时间"
          align="left"
          width="150"
        />
        <el-table-column
          prop="verifyresults"
          label="验证结果"
          align="left"
          width="100"
        />
        <el-table-column prop="reason" label="失败原因" align="left" />
        <el-table-column
          prop="snapshots"
          label="认证图片"
          align="center"
          width="150"
        >
          <template v-slot="{ row }">
            <el-image
              style="width: 50px; height: 50px"
              :src="row.snapshots"
              :preview-src-list="[row.snapshots]"
            />
          </template>
        </el-table-column>
      </JADP-table>
      <pagination
        :total="total"
        :page.sync="listQuery.currentPage"
        :limit.sync="listQuery.pageSize"
        @pagination="init(learningRecordId)"
      />
      <span slot="footer" class="dialog-footer">
        <el-button @click="visible = false">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import request from "@/utils/request";
export default {
  name: "",
  data() {
    return {
      visible: false,
      listLoading: false,
      learningRecordId: "",
      list: [],
      total: 0,
      listQuery: {
        currentPage: 1,
        pageSize: 5,
        sort: "desc",
        sidx: ""
      }
    };
  },
  methods: {
    init(id) {
      this.visible = true;
      this.listLoading = true;
      this.learningRecordId = id;
      request({
        url: "/api/xy_kj_learn_center/Xy_kj_snapshot_records",
        method: "get",
        data: {
          processid: id,
          type: 1, //1-人脸认证 2-摄像头 3-验证码验证
          ...this.listQuery,
          organizeId:this.$store.getters.organizeId
        }
      }).then(res => {
        this.list = res.data.list;
        this.total = res.data.pagination.total;
        this.listLoading = false;
      });
    }
  }
};
</script>
<style scoped lang="scss"></style>
